<template>
  <div class="view">
    <x-header :left-options="{backText: ''}"
              class="vux-1px-b">添加支付宝账户</x-header>
    <div class="admin">
      <p>账号<input type="text"
               id="admintel"
               placeholder="请输入账号"
               v-model="form.account_number" /></p>
    </div>
    <div class="adminname">
      <p>账号名称<input type="text"
               id="name"
               placeholder="请输入真实姓名"
               v-model="form.account_name" /></p>
    </div>
    <button @click="submit">确定</button>
  </div>
</template>
<script>
import { mapState } from 'vuex'
import { SubmitPaymentAccount } from '@api'
export default {
  computed: {
    ...mapState(['user'])
  },
  data () {
    return {
      form: {
        user_type: 2,
        account_type: 1,
        bank_name: '支付宝'
      }
    }
  },
  methods: {
    async submit () {
      if (!this.form.account_number || this.form.account_number.length === 0) {
        return this.$toastText('请先输入支付宝账号！')
      }
      if (!this.form.account_name || this.form.account_name.length === 0) {
        return this.$toastText('请先输入支付宝名称！')
      }
      // 添加用户支付宝收款账户
      let res = await SubmitPaymentAccount(this.form)
      if (res.code === 200) {
        this.$toastText(res.msg)
        this.$router.back()
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.view {
  .admin {
    padding-left: .125rem;
    width: 100%;
    margin-top: .25rem;
    line-height: .75rem;
    background: rgba(255, 255, 255, 1);
    p {
      text-align: left;
      font-size: .35rem;
      #admintel {
        width: 60%;
        height: .75rem;
        background: rgba(255, 255, 255, 1);
        border: 0;
        padding-left: .15rem;
        color: gray;
      }

    }
  }

  .adminname {
    padding-left: .125rem;
    width: 100%;
    line-height: .75rem;
    margin-top: .25rem;
    background: rgba(255, 255, 255, 1);
    p {
      text-align: left;
      font-size: .35rem;
      #name {
        width: 60%;
        height: .75rem;
        background: rgba(255, 255, 255, 1);
        border: 0;
        padding-left: .15rem;
        color: gray;
      }

    }
  }

  button {
    text-align: center;
    width: 100%;
    height: 1.225rem;
    position: fixed;
    left: 0;
    bottom: 0;
    border: 0;
    color: #fff;
    background: #ff0036;
  }
}
</style>
